/**
 * @desc 接待设置
 * @author yd_zhaorongjun
 */
<template>
  <div class="gl_contentBox_noShadow gl_heightFull" style="padding-top:10px">
    <template>
      <el-row style="margin:0 0 28px 0">
        <!-- 添加接送地按钮 -->
        <el-col :span="24">
          <el-button style="margin-right:23px" type="primary" size="mini" icon="el-icon-circle-plus-outline" @click="editOfAdd()">添加接送地</el-button>
          <span v-loading="timeLoading">
            <span v-if="bookingTime">
              <span style="vertical-align: middle;">汽车接待预定时间：{{ bookingTime.startDateTime | FormatDate('yyyy-MM-dd') }} 至 {{ bookingTime.endDateTime | FormatDate('yyyy-MM-dd') }}</span>
              <el-button style="color:#FFBA00;margin-left:31px;font-size:14px" type="text" size="mini" @click="clickTime('edit')">修改</el-button>
            </span>
            <span v-else>
              <span style="vertical-align: middle;">汽车接待预订时间未设置</span>
              <el-button style="color:#FFBA00;margin-left:31px;font-size:14px" type="text" size="mini" @click="clickTime('add')">请设置</el-button>
            </span>
          </span>
        </el-col>
      </el-row>
      <el-table v-loading="tableLoading" :data="tableData" class="gl_table_noBorder" size="mini" style="width: 100%;" @expand-change="expandChange">
        <el-table-column type="expand">
          <template slot-scope="props">
            <el-table v-loading="props.row.tableLoading" :data="props.row.children" class="gl_table_childrenThead" size="mini" style="width: 100%;">
              <el-table-column label="车辆图片" align="center" width="160">
                <template slot-scope="{row}">
                  <div style="position: relative;">
                    <img class="roomPhoto" :src="getStaticFileUrl(row.carImage)" alt="" @error="errorPhoto" @mouseenter="showRoomImg(...arguments, row.carImage)" @mouseleave="hideRoomImg(row.carImage)">
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                label="车辆类型"
                min-width="120"
              >
                <template slot-scope="{row}">
                  {{ row.carType || '--' }}
                </template>
              </el-table-column>
              <el-table-column
                label="座位"
                width="110"
              >
                <template slot-scope="{row}">
                  {{ row.carSeatName || '--' }}
                </template>
              </el-table-column>
              <el-table-column
                label="车辆颜色"
                width="130"
              >
                <template slot-scope="{row}">
                  {{ row.carColor || '--' }}
                </template>
              </el-table-column>
              <el-table-column label="是否可接车" align="center" width="120">
                <template slot-scope="{row}">
                  <el-select v-if="row.isEdit" v-model="Api_PUT_ReceptionPickUpAddressBaseInput.isPicksUp" placeholder="请选择" style="width:85%" size="mini">
                    <el-option :value="false" label="否" />
                    <el-option :value="true" label="是" />
                  </el-select>
                  <span v-else>
                    {{ row.isPicksUp ? '是' : '否' }}
                  </span>
                </template>
              </el-table-column>
              <el-table-column label="接车价格" align="center" width="130">
                <template slot-scope="{row}">
                  <div v-if="row.isEdit" class="gl_input_number">
                    ￥
                    <el-input-number v-model="Api_PUT_ReceptionPickUpAddressBaseInput.picksUpPrice" :disabled="!Api_PUT_ReceptionPickUpAddressBaseInput.isPicksUp" :controls="false" :precision="2" placeholder="请输入" size="mini" controls-position="right" :min="0" style="width: 60%;padding-left:5px;padding-right:5px" />
                  </div>
                  <span v-else>
                    {{ row.picksUpPrice || row.picksUpPrice === 0 ? '￥' + row.picksUpPrice/100 : '--' }}
                  </span>
                </template>
              </el-table-column>
              <el-table-column label="是否可送车" align="center" width="120">
                <template slot-scope="{row}">
                  <el-select v-if="row.isEdit" v-model="Api_PUT_ReceptionPickUpAddressBaseInput.isSends" placeholder="请选择" style="width:85%" size="mini">
                    <el-option :value="false" label="否" />
                    <el-option :value="true" label="是" />
                  </el-select>
                  <span v-else>
                    {{ row.isSends ? '是' : '否' }}
                  </span>
                </template>
              </el-table-column>
              <el-table-column label="送车价格" align="center" width="130">
                <template slot-scope="{row}">
                  <div v-if="row.isEdit" class="gl_input_number">
                    ￥
                    <el-input-number v-model="Api_PUT_ReceptionPickUpAddressBaseInput.sendsPrice" :disabled="!Api_PUT_ReceptionPickUpAddressBaseInput.isSends" :controls="false" :precision="2" placeholder="请输入" size="mini" controls-position="right" :min="0" style="width: 60%;padding-left:5px;padding-right:5px" />
                  </div>
                  <span v-else>
                    {{ row.sendsPrice || row.sendsPrice === 0 ? '￥' + row.sendsPrice/100 : '--' }}
                  </span>
                </template>
              </el-table-column>
              <el-table-column label="运营时间" align="center" width="220">
                <template slot-scope="{row}">
                  <el-time-picker
                    v-if="row.isEdit"
                    v-model="eventTime"
                    is-range
                    range-separator="至"
                    start-placeholder="开始时间"
                    end-placeholder="结束时间"
                    placeholder="选择时间范围"
                    format="HH:mm"
                    value-format="HH:mm"
                    size="mini"
                    style="width:90%"
                    @change="timeChange"
                  />
                  <span v-else>
                    {{ 10 > row.runningStartHour ? '0' + row.runningStartHour : row.runningStartHour }}:{{ 10 > row.runningStartMinute ? '0' + row.runningStartMinute : row.runningStartMinute }} - {{ 10> row.runningEndHour ? '0' + row.runningEndHour : row.runningEndHour }}:{{ 10 > row.runningEndMinute ? '0' + row.runningEndMinute : row.runningEndMinute }}
                  </span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('table.actions')" min-width="160">
                <template slot-scope="{row,$index}">
                  <el-button size="mini" type="text" style="color:#FF3434" @click="deleteTableRow(row, props.row)">删除</el-button>
                  <el-button v-if="row.isEdit" size="mini" type="text" @click="clickChildrenRowSave(row, props.row)">保存</el-button>
                  <el-button v-else size="mini" type="text" @click="clickEidt(row, props.$index, $index, true)">编辑</el-button>
                  <el-button v-if="row.isEdit" size="mini" type="text" @click="clickEidt(row, props.$index, $index, false)">取消</el-button>
                </template>
              </el-table-column>
            </el-table>
          </template>
        </el-table-column>
        <el-table-column
          label="接站地点"
          min-width="200"
          align="left"
        >
          <template slot-scope="{row}">
            {{ `${row.departureStation} -- ${row.arrivalStation}` }}
          </template>
        </el-table-column>
        <el-table-column :label="$t('table.actions')" width="200">
          <template slot-scope="{row}">
            <el-button size="mini" type="text" @click="clickTableChildAdd(row)">选择车辆类型</el-button>
            <el-button size="mini" type="text" style="color:#FF3434" @click="clickDelete(row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <img v-if="isShowImg && getStaticFileUrl(bigImg)" class="roomBigPhoto" :style="position" :src="getStaticFileUrl(bigImg)" alt="" @error="errorPhoto">
      <img v-if="isShowRoomImg && getStaticFileUrl(bigImg)" class="roomBigPhoto" :style="position" :src="getStaticFileUrl(bigImg)" alt="" @error="errorPhoto">
      <el-row class="gl_pt_20" style="text-align: right;">
        <el-pagination
          :current-page="Api_GET_TenantsQO.Page"
          :page-size="Api_GET_TenantsQO.MaxResultCount"
          :total="totalPage"
          layout="total,sizes,prev,pager,next,jumper"
          :page-sizes="[10, 20, 30, 40]"
          @size-change="sizeChange"
          @current-change="pageIndexChange"
        />
      </el-row>
    </template>
    <add-time ref="addTime" @insert="timeInsert" @update="timeUpdate" />
    <add-address ref="addAddress" @insert="AddressInsert" />
    <add-car ref="addCar" @insert="carInsert" />
  </div>
</template>

<script>

import { mapState, mapActions } from 'vuex';
// import { FormatDate } from '@/lib';
import defaultHotelImg from '@/assets/images/face_default.png';
import { Api_GET_TenantsQO, SaasTenantCreateDto } from '@/lib/form/swaggerForm';
import { translateByCode } from '@/lib/getTransData';
import addAddress from './addAddress';
import addCar from './addCar';
import addTime from '../addTime';
import { CopyData } from '@/lib';
import {
  Api_GET_EventsManagementReceptionQO,
  Api_GET_EventsManagementReceptionReceptionModelOfCarReceptionIdQO,
  SiSTKWEventsManagementReceptionPickUpAddressBaseInput
} from '@/lib/form/game/swaggerForm';
import {
  api_GET_EventsManagementReception,
  api_POST_EventsManagementLogisticReservationTimeCompetitionReservationTime,
  api_GET_EventsManagementLogisticReservationTimeCompetitionReservationTime,
  api_PUT_EventsManagementLogisticReservationTimeId,
  api_POST_EventsManagementReceptionReception,
  api_DELETE_EventsManagementReceptionIdReception,
  api_GET_EventsManagementReceptionReceptionModelOfCarReceptionId,
  api_PUT_EventsManagementReceptionReceptionPickUpAddressModelOfCarReceptionModelOfCarId,
  api_POST_EventsManagementReceptionReceptionPickUpAddressModelOfCarReceptionId,
  api_DELETE_EventsManagementReceptionReceptionPickUpAddressModelOfCarReceptionModelOfCarId
} from '@/extend/api/gameswaggerApi/app.js';
export default {
  components: {
    addAddress,
    addCar,
    addTime
  },
  data() {
    return {
      defaultHotelImg: defaultHotelImg,
      SaasTenantCreateDto: new SaasTenantCreateDto(),
      Api_GET_TenantsQO: new Api_GET_TenantsQO(),
      Api_GET_EventsManagementReceptionQO: new Api_GET_EventsManagementReceptionQO(),
      Api_GET_ReceptionIdQO: new Api_GET_EventsManagementReceptionReceptionModelOfCarReceptionIdQO(),
      Api_PUT_ReceptionPickUpAddressBaseInput: new SiSTKWEventsManagementReceptionPickUpAddressBaseInput(),
      freeDay: [],
      tableLoading: false,
      totalPage: 0,
      bookingTime: '', // 预订时间
      timeLoading: false,
      tableData: [],
      eventTime: [],
      provinceList: [], // 地区的下拉列表
      addressId: '', // 接送地编辑时候的id
      roomId: '', // 车型编辑时候的id
      currentPage: 1,
      editionsList: [],
      greatPersonList: [],
      bigImg: '',
      isShowImg: false,
      isShowRoomImg: false,
      timeOut: '',
      gameId: '',
      tableRow: {}, //
      position: {
        left: 0,
        top: 0
      },
      isTrain: false // 判断是不是培训管理里的后勤
    };
  },
  computed: {
    ...mapState({
      cache: state => state.dict.cache,
      dict: state => state.dict.dict,
      dictAll: state => state.dict.dictAll
    })
  },
  created() {
    this.gameId = this.$route.params.id;
    if (this.$route.path.indexOf('/train/') > -1) {
      this.isTrain = true;
    }
    this.getDictByType(['district']);
    this.getDict();
    this.getReservationTime();
    this.refreshList();
  },
  methods: {
    ...mapActions({ getDictByType: 'dict/getDictByType', getDict: 'dict/getDict' }),
    // 根据赛事和后勤业务编码获取预定时间
    getReservationTime() {
      this.timeLoading = true;
      const _providerName = this.isTrain ? 'T' : 'C'; // C是赛事 T是培训
      api_GET_EventsManagementLogisticReservationTimeCompetitionReservationTime({
        providerKey: this.gameId,
        providerName: _providerName,
        reservationCode: 'Reception'
      }).then(res => {
        this.bookingTime = res || '';
        this.timeLoading = false;
      }, () => {
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
        this.timeLoading = false;
      });
    },
    // 刷新列表
    refreshList(page) {
      this.tableLoading = true;

      this.Api_GET_EventsManagementReceptionQO.Page = page || 1;
      this.Api_GET_EventsManagementReceptionQO.SkipCount = (this.Api_GET_EventsManagementReceptionQO.Page - 1) * this.Api_GET_EventsManagementReceptionQO.MaxResultCount;
      this.Api_GET_EventsManagementReceptionQO.providerKey = this.gameId;

      api_GET_EventsManagementReception(this.Api_GET_EventsManagementReceptionQO).then(res => {
        res.items.map(item => {
          item.children = [];
          item.tableLoading = false;
        });
        this.tableData = res.items;
        this.totalPage = res.totalCount;
        this.tableLoading = false;
      }, error => {
        this.tableLoading = false;
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    // 展开事件----动态获取内嵌表数据
    expandChange(row, expandedRows) {
      // 该处是用于判断是展开还是收起行，只有展开的时候做请求，避免多次请求！
      // 展开的时候expandedRows有值，收起的时候为空.HasWindow
      if (expandedRows.length > 0) {
        this.getChildTableData(row);
      }
    },
    // 获取当前酒店所有房间   parentRow是从子table传入的父row
    getChildTableData(row, parentRow) {
      if (parentRow) {
        parentRow.tableLoading = true;
      } else {
        row.tableLoading = true;
      }
      const _id = parentRow ? parentRow.receptionId : row.receptionId;
      this.Api_GET_ReceptionIdQO = new Api_GET_EventsManagementReceptionReceptionModelOfCarReceptionIdQO();
      this.Api_GET_ReceptionIdQO.MaxResultCount = 999;
      api_GET_EventsManagementReceptionReceptionModelOfCarReceptionId(_id, this.Api_GET_ReceptionIdQO).then(res => {
        // 遍历当前页面表
        this.tableData.forEach((temp, index) => {
          // 找到当前点击的行，把动态获取到的数据赋值进去
          if (temp.receptionId === _id) {
            this.tableData[index].children = res.items || [];
            this.tableData[index].tableLoading = false;
          }
        });
      }, error => {
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
        if (parentRow) {
          parentRow.tableLoading = false;
        } else {
          row.tableLoading = false;
        }
      });
    },
    // 重置搜索表单
    refreshSearchForm() {
      this.Api_GET_TenantsQO = new Api_GET_TenantsQO();
      this.freeDay = [];
      this.refreshList();
    },
    // 添加或修改接送站
    editOfAdd(row) {
      this.$refs.addAddress.open(row);
    },
    // 添加汽车
    clickTableChildAdd(row) {
      // 没有酒店预订时间的话弹出提示框，先添加时间 this.bookingTime
      if (!this.bookingTime) {
        this.$message({ type: 'warning', message: '请先设置预定时间！' });
        return;
      }
      this.addressId = row ? row.receptionId : '';
      this.tableRow = row || {};
      this.$refs.addCar.open(row);
    },
    // 打开时间设置弹框
    clickTime(type) {
      this.$refs.addTime.open(this.bookingTime, type, this.gameId, 'Reception');
    },
    // 添加时间设置
    timeInsert(data) {
      const _this = this;
      api_POST_EventsManagementLogisticReservationTimeCompetitionReservationTime(data).then(res => {
        this.$message({
          // 添加成功！
          message: translateByCode('alert.addSuccessfully'),
          type: 'success'
        });
        _this.$refs.addTime.dialogVisible = false;
        _this.$refs.addTime.submitLoading = false;
        this.getReservationTime();
      }, error => {
        _this.$refs.addTime.submitLoading = false;
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    // 修改时间设置
    timeUpdate(data) {
      const _this = this;
      api_PUT_EventsManagementLogisticReservationTimeId(data.id, { startDateTime: data.startDateTime, endDateTime: data.endDateTime,expirationTime: data.expirationTime }).then(res => {
        this.$message({
          // 添加成功！
          message: translateByCode('alert.editSuccessfully'),
          type: 'success'
        });
        _this.$refs.addTime.dialogVisible = false;
        _this.$refs.addTime.submitLoading = false;
        this.getReservationTime();
      }, error => {
        _this.$refs.addTime.submitLoading = false;
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    // 添加接送站地址
    AddressInsert(data) {
      const _this = this;
      const _providerName = this.isTrain ? 'T' : 'C'; // C是赛事 T是培训
      api_POST_EventsManagementReceptionReception({ providerKey: this.gameId, providerName: _providerName }, data).then(res => {
        this.$message({
          // 添加成功！
          message: translateByCode('alert.addSuccessfully'),
          type: 'success'
        });
        _this.$refs.addAddress.dialogVisible = false;
        _this.$refs.addAddress.submitLoading = false;
        _this.refreshList(this.Api_GET_TenantsQO.Page);
      }, error => {
        _this.$refs.addAddress.submitLoading = false;
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    // 添加汽车
    carInsert(data) {
      const _this = this;
      api_POST_EventsManagementReceptionReceptionPickUpAddressModelOfCarReceptionId(this.addressId, data).then(res => {
        this.$message({
          // 添加成功！
          message: translateByCode('alert.addSuccessfully'),
          type: 'success'
        });
        _this.$refs.addCar.dialogVisible = false;
        _this.$refs.addCar.submitLoading = false;
        _this.getChildTableData(_this.tableRow);
      }, error => {
        _this.$refs.addCar.submitLoading = false;
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    // 控制车型的编辑状态
    clickEidt(row, index, jndex, type) {
      this.eventTime = ['', ''];
      this.Api_PUT_ReceptionPickUpAddressBaseInput = new SiSTKWEventsManagementReceptionPickUpAddressBaseInput();
      CopyData(row, this.Api_PUT_ReceptionPickUpAddressBaseInput);
      this.Api_PUT_ReceptionPickUpAddressBaseInput.isPicksUp = row.isPicksUp;
      this.Api_PUT_ReceptionPickUpAddressBaseInput.isSends = row.isSends;
      this.Api_PUT_ReceptionPickUpAddressBaseInput.picksUpPrice = row.picksUpPrice / 100;
      this.Api_PUT_ReceptionPickUpAddressBaseInput.sendsPrice = row.sendsPrice / 100;
      const _startTime = (row.runningStartHour < 10 ? '0' + row.runningStartHour : row.runningStartHour) + ':' + (row.runningStartMinute < 10 ? '0' + row.runningStartMinute : row.runningStartMinute);
      const _endTime = (row.runningEndHour < 10 ? '0' + row.runningEndHour : row.runningEndHour) + ':' + (row.runningEndMinute < 10 ? '0' + row.runningEndMinute : row.runningEndMinute);
      this.eventTime = [_startTime || '', _endTime || ''];
      console.log(this.Api_PUT_ReceptionPickUpAddressBaseInput);

      for (let i = 0; i < this.tableData.length; i++) {
        const item = this.tableData[i];
        for (let j = 0; j < item.children.length; j++) {
          const jtem = item.children[j];
          this.$set(jtem, 'isEdit', false);
        }
      }
      this.$set(this.tableData[index].children[jndex], 'isEdit', type);
    },
    // 子表格里的保存
    clickChildrenRowSave(row, tableRow) {
      const _this = this;
      const _data = new SiSTKWEventsManagementReceptionPickUpAddressBaseInput();
      CopyData(this.Api_PUT_ReceptionPickUpAddressBaseInput, _data);
      _data.picksUpPrice = _data.picksUpPrice ? Math.floor(_data.picksUpPrice * 1000) / 10 : 0;
      _data.sendsPrice = _data.sendsPrice ? Math.floor(_data.sendsPrice * 1000) / 10 : 0;
      _data.runningStartHour = this.eventTime[0].split(':')[0];
      _data.runningStartMinute = this.eventTime[0].split(':')[1];
      _data.runningEndHour = this.eventTime[1].split(':')[0];
      _data.runningEndMinute = this.eventTime[1].split(':')[1];
      api_PUT_EventsManagementReceptionReceptionPickUpAddressModelOfCarReceptionModelOfCarId(row.id, _data).then(res => {
        this.$message({
          // 添加成功！
          message: '保存成功',
          type: 'success'
        });
        _this.getChildTableData(tableRow);
      }, error => {
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    // 删除按钮
    clickDelete(row) {
      const _this = this;
      // 您确定要删除 xxx 吗？ zh
      const _confirmStr = ` ${translateByCode('alert.wantDelete')} [ ${row.departureStation} -- ${row.arrivalStation} ] ${translateByCode('alert.ma')}`;
      this.$confirm(_confirmStr, translateByCode('alert.warning'), {
        confirmButtonText: translateByCode('alert.confirm'),
        cancelButtonText: translateByCode('alert.cancel'),
        type: 'warning'
      }).then(() => {
        api_DELETE_EventsManagementReceptionIdReception(row.receptionId).then(res => {
          if (res) {
            this.$message({
              type: 'success',
              // 删除成功！
              message: translateByCode('alert.deleteSuccessfully')
            });
            _this.refreshList(this.Api_GET_EventsManagementReceptionQO.Page);
          } else {
            this.$message({
              duration: 15000,
              showClose: true,
              message: '删除失败',
              type: 'error'
            });
          }
        }).catch(
          error => {
            const _msg = error.error.message || error.message;
            this.$message({
              duration: 15000,
              showClose: true,
              message: _msg,
              type: 'error'
            });
          }
        );
      });
    },
    // TableRow删除按钮
    deleteTableRow(row, tableRow) {
      const _this = this;
      // 您确定要删除 xxx 吗？ zh
      const _confirmStr = ` ${translateByCode('alert.wantDelete')} [ ${row.carType} ] ${translateByCode('alert.ma')}`;
      this.$confirm(_confirmStr, translateByCode('alert.warning'), {
        confirmButtonText: translateByCode('alert.confirm'),
        cancelButtonText: translateByCode('alert.cancel'),
        type: 'warning'
      }).then(() => {
        api_DELETE_EventsManagementReceptionReceptionPickUpAddressModelOfCarReceptionModelOfCarId(row.id).then(res => {
          this.$message({
            type: 'success',
            // 删除成功！
            message: translateByCode('alert.deleteSuccessfully')
          });
          _this.getChildTableData(tableRow);
        }).catch(
          error => {
            const _msg = error.error.message || error.message;
            this.$message({
              duration: 15000,
              showClose: true,
              message: _msg,
              type: 'error'
            });
          }
        );
      });
    },
    sizeChange(MaxResultCount) {
      this.Api_GET_TenantsQO.MaxResultCount = MaxResultCount;
      this.refreshList();
    },
    pageIndexChange(currentPage) {
      this.refreshList(currentPage);
    },
    // 获取静态文件
    getStaticFileUrl(relativeUrl) {
      if (!relativeUrl) return '';
      return WEB_CONFIG.VUE_APP_STATIC_FILE_RUL + relativeUrl;
    },
    errorPhoto() {
      const img = event.srcElement;
      img.src = this.defaultHotelImg;
    },
    showImg(event, img) {
      const _this = this;
      _this.bigImg = img;
      const _img = event.target; // 这里就是获取到的dom元素
      const _position = _img.getBoundingClientRect();
      this.timeOut = setTimeout(() => {
        _this.isShowImg = true;
        this.$set(this.position, 'left', _position.left + 60 + 'px');
        this.$set(this.position, 'top', _position.top + 'px');
      }, 300);
    },
    hideImg(img) {
      const _this = this;
      clearTimeout(this.timeOut);
      _this.isShowImg = false;
    },
    showRoomImg(event, img) {
      const _this = this;
      _this.bigImg = img;
      const _img = event.target; // 这里就是获取到的dom元素
      const _position = _img.getBoundingClientRect();
      console.log(_position);
      this.timeOut = setTimeout(() => {
        _this.isShowRoomImg = true;
        _this.$set(_this.position, 'left', _position.left + 60 + 'px');
        _this.$set(_this.position, 'top', _position.top + 'px');
      }, 300);
      console.log(this.position);
    },
    hideRoomImg() {
      const _this = this;
      clearTimeout(this.timeOut);
      _this.isShowRoomImg = false;
    },
    timeChange(val) {
      console.log(val);
    },
    /**
    * 将时间格式化为标准字符串==HH-MM-DD HH:MI:ss
    *
    *
    * */
    createTimeStr (time = new Date(), type = 'ymdhis') {
      const date = new Date(time);
      let Str = '';
      const year = date.getFullYear();
      let month = date.getMonth() + 1;
      if (month < 10)month = '0' + month;
      let day = date.getDate();
      if (day < 10) day = '0' + day;
      let hours = date.getHours();
      if (hours < 10)hours = '0' + hours;
      let minutes = date.getMinutes();
      if (minutes < 10)minutes = '0' + minutes;
      let Seconds = date.getSeconds();
      if (Seconds < 10)Seconds = '0' + Seconds;
      if (type === 'ymdhis') {
        Str = year + '-' +
          month + '-' +
            day + ' ' +
          hours + ':' +
          minutes + ':' +
          Seconds;
      } else if (type === 'ymd') {
        Str = year + '-' +
          month + '-' +
          day;
      } else if (type === 'his') {
        Str = hours + ':' +
          minutes + ':' +
          Seconds;
      }
      return Str;
    }
  }
};
</script>
<style lang="scss" scoped>
  .hotelPhoto, .roomPhoto{
    width: 48px;
    height: 36px;
    vertical-align: middle;
  }
  .hotelBigPhoto{
    width: 310px;
    height: 280px;
    position: absolute;
    z-index: 10;
    left: 70px;
  }
  .roomBigPhoto{
    width: 310px;
    height: 280px;
    position: fixed;
    z-index: 10;
  }
  .icon_color {
    color: #1682e6;
  }
  .el-input-number.is-without-controls .el-input__inner{
    padding-left: 5px;
    padding-right: 5px;
  }
</style>
